<template>
  <div>
    <el-dialog 
      width="900px"
      :title="$t('修改密码')"
      :visible.sync="isShow"
      :close-on-click-modal="false"
    >
      <div class="ipt_list u-f u-f-ac">
        <p class="lable font14 text_black">{{$t('原密码')}}：</p>
        <el-input v-model="old_password" show-password :placeholder="$t('请输入')"></el-input>
      </div>
      <div class="ipt_list u-f u-f-ac">
        <p class="lable font14 text_black">{{$t('新密码')}}：</p>
        <el-input v-model="password" show-password :placeholder="$t('请输入')"></el-input>
      </div>
      <div class="ipt_list u-f u-f-ac">
        <p class="lable font14 text_black">{{$t('确认密码')}}：</p>
        <el-input v-model="repassword" show-password :placeholder="$t('请输入')"></el-input>
      </div>

      <el-button type="primary" @click="handleChange">{{$t('提交')}}</el-button>
    </el-dialog>
  </div>
  
</template>

<script>
import util from '@/assets/js/util.js'
export default {
  name: "changePassword",
  data() {
    return {
      isShow: false,
      old_password: '',
      password: '',
      repassword: '',
    };
  },
  props: {
    
  },
  components: {
    
  },
  methods: {
    show() {
      this.isShow = true;
    },
    handleChange() {
      util.$http('/user/password', {
        old_password: this.old_password,
        password: this.password,
        repassword: this.repassword,
      })
      .then(res=>{
        if(res.code == 1) {
          this.isShow = false;
          this.$message({
            message: res.msg,
            type: 'success'
          })
        }
      })
    }
  }
};
</script>

<style scoped>
.ipt_list{
  margin-left: 20px;
  margin-bottom: 20px;
}
.ipt_list .lable{
  margin: 0 10px 0 0;
  width: 90px;
}
.ipt_list .el-input{
  width: 200px;
}
.el-button{
  margin-left: 20px;
  margin-top: 30px;
}
</style>
